<template>
  <a-modal
    :visible="visible"
    :title="info.edit?'修改':'查看详情'"
    :width="1600"
    :bodyStyle="{
      height: '500px',
      overflow: 'auto'
    }"
    :closable="false"
    okText="提交审核"
    @cancel="() => { $emit('cancel') }"
    @ok="confirm"
  >
    <detail-list :col="3">
      <detail-list-item term="学号">{{ info.xht }}&nbsp;</detail-list-item>
      <detail-list-item term="姓名">{{ info.xsxx.xm }}&nbsp;</detail-list-item>
      <detail-list-item term="院系">{{ info.xsxx.xjxx.ssyxmc }}&nbsp;</detail-list-item>
      <detail-list-item term="专业">{{ info.xsxx.xjxx.sszymc }}&nbsp;</detail-list-item>
      <detail-list-item term="入学年月">{{ info.xsxx.xjxx.rxny.split(' ')[0] }}&nbsp;</detail-list-item>
      <detail-list-item term="导师姓名">{{ info.xsxx.xjxx.dsxm }}&nbsp;</detail-list-item>
      <detail-list-item term="培养层次">{{ info.xsxx.xjxx.pyccmc }}&nbsp;</detail-list-item>
      <detail-list-item term="学生联系方式">{{ info.xsxx.lxdh }}&nbsp;</detail-list-item>
      <detail-list-item term="出生日期">{{ info.xsxx.csrq }}&nbsp;</detail-list-item>
      <detail-list-item term="出生地">{{ info.xsxx.csdcdmc }}&nbsp;{{ info.xsxx.csdxqdmc }}&nbsp;</detail-list-item>
      <detail-list-item term="性别">{{ info.xsxx.xbmc }}&nbsp;</detail-list-item>
      <detail-list-item term="政治面貌">{{ info.xsxx.zzmmmc }}&nbsp;</detail-list-item>
      <detail-list-item term="民族">{{ info.xsxx.mzmc }}&nbsp;</detail-list-item>
      <detail-list-item term="导师联系方式">{{ info.xsxx.xjxx.dslxdh }}&nbsp;</detail-list-item>
<!--       
      <detail-list-item term="回程出发时间">{{ info.cfDate }}&nbsp;</detail-list-item>
      <detail-list-item term="回程出发地">{{ info.cfd }}&nbsp;</detail-list-item> -->
      <detail-list-item term="项目名称">{{ info.projectName }}&nbsp;</detail-list-item>
    </detail-list>
    

    <a-form :form="form">
      <a-col :span="24">
        <a-form-item
          label="回程出发日期"
          :labelCol="{span: 2,offset: 0}"
          :wrapperCol="{span: 16}"
        >
          <a-date-picker  v-decorator="['cfDate',
          {
            rules: [{ required: true, message: '请选择回程出发日期' }],
          }]" placeholder="" :disabled="!info.edit"/>
        </a-form-item>
      </a-col>

      <a-col :span="24">
        <a-form-item
          label="回程出发地"
          :labelCol="{span: 2,offset: 0}"
          :wrapperCol="{span: 4}"
        >
          <a-input v-decorator="['cfd',
            {
              rules: [{ required: true, message: '请输入回程出发地!' }],
            }]" :disabled="!info.edit"/>
        </a-form-item>
      </a-col>
      <a-col :span="24">
        <a-form-item
          label="到达日期"
          :labelCol="{span: 2,offset: 0}"
          :wrapperCol="{span: 16}"
        >
          <a-date-picker  v-decorator="['ddDate',
          {
            rules: [{ required: true, message: '请选择到达日期' }],
          }]" placeholder="" :disabled="!info.edit"/>
        </a-form-item>
      </a-col>
      <!-- <a-col :span="24">
        <a-form-item
          :label="$t('key.xmmc')"
          :labelCol="{span: 6,offset: 1}"
          :wrapperCol="{span: 16}"
        >
          <a-select  v-decorator="['gjhxmsbId',
            {
              rules: [{ required: true, message: ' ' }],
            }]" :allowClear="true" showSearch optionFilterProp="children">
              <a-select-option :key="i.id" :value="i.id" v-for="i in xmList">{{ i.projectName }}</a-select-option>
            </a-select>
        </a-form-item>
      </a-col> -->
      <!-- <a-col :span="24">
        <a-form-item
          :label="$t('key.attachment')"
          :labelCol="{span: 6,offset: 1}"
          :wrapperCol="{span: 16}"
        >
          <a-upload @change='handleImport' :fileList="fileList" :beforeUpload="beforeUpload"  :remove="handleRemove" :multiple="true" >
                    <a-button  :loading="uploading"><a-icon type="upload" />{{uploading ? 'Uploading' : '点击上传附件' }}</a-button>
          </a-upload>
        </a-form-item>
        <p style="color:#E51C23;white-space:pre-wrap;">1.上传附件：①.学习总结（附件word）、②.思想生活总结（附件word）、③.学术总结（附件word）</p>
        <p style="color:#E51C23">2.附件①-③上传格式为word，大小≦2M</p>
      </a-col> -->
     
  
    </a-form>
    <a-col style="padding-bottom:16px" v-if="info.coursewareList && info.coursewareList.length">
        <div class="term" style="color: rgba(0, 0, 0, 0.85)">附件:</div>
        <a-upload :default-file-list="defaultFileList"></a-upload>
    </a-col>
    <template>

        <p style="text-align: center" slot="footer" >
          <a-button v-if="info.edit" type="primary" @click="confirm">保存</a-button>
          <a-button type="primary" @click="() => { $emit('cancel') }">关闭</a-button>
        </p>
    </template>

  </a-modal>

</template>

<script>
    import {STable} from '~'
    import DetailList from '~/tool/DetailList'
    import moment from 'moment'

    const DetailListItem = DetailList.Item

export default {
  props:['visible','info'],
  components: {DetailList, DetailListItem, STable},
  data () {
    return {
      form: this.$form.createForm(this),
     rptInfo: {
      },
      defaultFileList:[],
      type:'',
      tableData: [],
    }
  },
  watch:{
    info(){
      this.info.xsxx.csrq = moment(this.info.xsxx.csrq).format('YYYY-MM-DD')
      this.info.cfDate = moment(this.info.cfDate, 'YYYY-MM-DD')
      this.info.ddDate = moment(this.info.ddDate, 'YYYY-MM-DD')
      if(this.info.coursewareList && this.info.coursewareList.length){
        this.info.coursewareList.map(item =>{
          item.name = item.sourceName
          item.uid = item.id
        })
        this.defaultFileList = this.info.coursewareList
      }
      this.$nextTick(()=>{
        let keys = Object.keys(this.form.getFieldsValue())
        let obj ={}
        keys.forEach(item =>{
          obj[item] = this.info[item]
        })
        this.form.setFieldsValue(obj)
      })
    }
  },
  methods: {
    remove (index) {
      this.tableData.splice(index, 1)
    },
    confirm () {
      this.form.validateFields((err, values) => {
        if (err) return
        console.log(this.hxbkwj,1111)
        values.cfDate = values.cfDate.format('YYYY-MM-DD')
        values.ddDate = values.ddDate.format('YYYY-MM-DD')
        let params = Object.assign({
          hxbkwj : this.hxbkwj,
          xht:this.info.xsxx.xh,
          id: this.info.id,
        }, values)
        this.$api.student.reportUpdate(params).then(res => {
          this.$message.success(res.msg)
          this.form.resetFields()
          this.$emit('cancel')
          this.$emit('refresh')
        })
      })
    }
  }
}
</script>

<style>

</style>
